<!--
 * @Author: cl
 * @Description: 分页插件测试
 * @Date: 2022-11-01 10:18:33
 * @LastEditTime: 2022-11-03 11:34:49
 * @FilePath: \vue3\src\views\vue3Study\pagination.vue
-->
<template>
    <div>
        <div>
            <el-table :data="dataList" style="width: 100%">
                <el-table-column show-overflow-tooltip label="名称" prop="name"></el-table-column>
                <el-table-column show-overflow-tooltip label="地址" prop="address"></el-table-column>
            </el-table>
        </div>
        <Pagination :total="total" :page="listQuery.pageNo" :limit="listQuery.pageSize" :params="listQuery"
            @pagination="getList" />
    </div>
</template>
<script setup>
import axios from "axios";
import { nextTick, reactive, ref } from "vue";
//查询筛选
let menuId = ref('1103')
let myModel = reactive({
})
let modelName = 'myName'
let TestModel = reactive({
})
console.log(myModel[modelName] = '12')
let test = (val) => {
    // console.log('myModel[modelName]:'+myModel[modelName]+' ----'+myModel.name)
    console.log(' ----' + myModel.myName)
    console.log('val:' + val)
    console.log('val:' + JSON.stringify(myModel))
}
//列表数据
let dataList = ref([])
let listQuery = reactive({
    pageNo: 1,
    pageSize: 10
})
let total = ref(0)
let getList = (params) => {
    axios.get("/api/getRef").then((res) => {
        total.value = 120
        // dataList.value.push(...res.data.userInfo);
        dataList.value = [...res.data.userInfo]
    });
}
let queryList = (params) => {
    console.log(params)
    getList(listQuery)
}
let sortList = (params) => {
    console.log(params)
    listQuery.pageNo = 1
    getList(listQuery)
}
let inputTest = (val) => {
    console.log(val + '--------------' + JSON.stringify(TestModel))
}

getList();
// getMenu();

</script>
<style scoped lang="scss">
.mycls {
    width: 100%;
    height: 100px;
    background-color: aqua;
}
</style>
